<%@ page contentType="text/html; charset=utf-8"%>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>黑马面面后台管理系统 | Log in</title>
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/ionicons/css/ionicons.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/adminLTE/css/AdminLTE.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/iCheck/square/blue.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/reset.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/login.css">
</head>

<script>
    window.onload = function () {
        if (window.parent.window != window) {
            window.top.location = "${pageContext.request.contextPath}/login.jsp";
        }
    }
</script>

<body id="particles-js">
<div class="login" id="login">
    <h3><a href="${pageContext.request.contextPath}/login.jsp">黑马面面后台管理系统</a></h3>
    <form action="${pageContext.request.contextPath}/loginServlet?method=login" method="post" autocomplete="off">
        <p id="msg" style="color: #ff0000">${msg}</p>
        <ul class="log-form">
            <li>
                <i class="name"></i>
                <input name="username" id="username" type="text" value="${cookie.username.value}" placeholder="请输入用户名" onblur="this.placeholder='请输入用户名'">
                <label for="username">用户名</label>
            </li>
            <li>
                <i class="password"></i>
                <input name="password" id="password" type="password" value="${cookie.password.value}" placeholder="请输入密码" onfocus="this.placeholder=''" onblur="this.placeholder='请输入密码'">
                <label for="password">密码</label>
            </li>
        </ul>
        <div class="login-button ">
            <button type="submit" class="login-button" style="border: 0px;width: 100%">登录</button>
        </div>
        <br/>
        <input name="remember" id="remember" type="checkbox" value="yes" checked>
        <label for="remember">记住密码</label>
        <input name="autoLogin" id="autoLogin" type="checkbox" value="yes">
        <label for="autoLogin">自动登录</label>
        <span>
                    <a href="${pageContext.request.contextPath}/loginServlet?method=returnRegister">&nbsp;&nbsp;&nbsp;免费注册&nbsp;&nbsp;|</a>
                </span>
        <span>
                    <%--跳转修改密码界面--%>
                    <a href="${pageContext.request.contextPath}/loginServlet?method=forget">忘记密码</a>
                </span>

    </form>

<%--    <div class="social-auth-links text-center">--%>
<%--        <p>- 或者 -</p>--%>
<%--        <a href="#" class="btn btn-block btn-social btn-facebook btn-flat"><i class="fa fa-qq"></i> 腾讯QQ用户登录</a>--%>
<%--        <a href="#" class="btn btn-block btn-social btn-google btn-flat"><i class="fa fa-weixin"></i> 微信用户登录</a>--%>
<%--    </div>--%>
</div>
<div class="rotating-plane " id="shape"></div>
<script src="${pageContext.request.contextPath}/plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/iCheck/icheck.min.js"></script>
<script src="${pageContext.request.contextPath}/js/particles.min.js"></script>
<script src="${pageContext.request.contextPath}/js/app.js"></script>
<script>
    // 重新输入username，把报错msg提示清空
    document.getElementById("username").onfocus=function (){
        document.getElementById("msg").innerHTML="";
    }
    // 勾选自动登录，默认勾选记住密码
    document.getElementById("autoLogin").onclick=function (){
        if (document.getElementById("autoLogin").checked){
            document.getElementById("remember").checked = true;
        }
    }
    // 没勾选记住密码，自动不勾选自动登录
    document.getElementById("remember").onclick=function (){
        if (!document.getElementById("remember").checked){
            document.getElementById("autoLogin").checked = false;
        }
    }
</script>
</body>
</html>
